import React, { Component } from 'react'
import axios from 'axios'
import '@/index.css'

export default class App extends Component {
  render() {
    return (
      <div>
        <button onClick={this.getData}>点我获取数据</button>
        <button onClick={this.getData2}>点我获取数据2</button>
        <ul>
          {
            this.state.list.map((item) => {
              return (
                <li key={item.id} >
                  <span>{item.name}</span>
                  <img src={item.icon} alt={item.name} width='30'/>
                </li>
              )
            })
          }
          <br/>
          {
            this.state.list2.map((item) => {
              return (
                <li key={item.id}>
                  <span>{item.name}</span>
                </li>
              )
            })
          }
        </ul>
      </div>
    )
  }
  // 定义初始化状态
  state = { list: [],list2:[] }
  getData = () => {
    axios.get('/conner/shop/goods/category/all').then((res) => {
      console.log('成功了', res.data)
      this.setState({ list: res.data.data })
    })
    .catch((rep) => {
      console.log('失败了', rep);
    })
  }
  getData2 = () => {
    axios.get('/api/students').then((res) => {
      console.log('成功了', res.data)
      this.setState({ list2: res.data })
    })
    .catch((rep) => {
      console.log('失败了', rep);
    })
  }
}
